<#include "/common/common.ftl">
<@html>
<link rel="stylesheet" href="${path}/css/user.css">
<script type="text/javascript" src="${path}/js/dojo/dojo/inputForm.gzjs"></script>
<script type="text/javascript">
	dojo.require("dojo.dnd.Source");
	//	dojo.require("dijit.dijit");
	//	dojo.require("dijit.form.Form");
	//	dojo.require("dijit.layout.TabContainer");
	//	dojo.require("dijit.layout.ContentPane");
	//	dojo.require("dijit.form.ValidationTextBox");
	//	dojo.require("dijit.form.DateTextBox");
	//	dojo.require("dojo.data.ItemFileReadStore");
	//	dojo.require("dijit.form.FilteringSelect");
	//	dojo.require("dojo.dnd.Source");
	//	dojo.require("dijit.form.CheckBox");
</script>
<form id="detailForm" jsId="detailForm" method="post" dojoType="dijit.form.Form">
	<input type="hidden" name="targetUser.id" value="${targetUser.id!}"/>

	<div class="small-form-layout">
		<div class="cell">
			<div class="label">用户名<@splitor/></div>
			<div class="content">
				<input name="targetUser.userCode" dojoType="dijit.form.ValidationTextBox"
				        required="true" promptMessage="请输入用户编号" id="userCode"
				       invalidMessage="只能是英文字母或数字" regExp="^\w+$"
				       value="${targetUser.userCode!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				用户名称<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.userName" dojoType="dijit.form.ValidationTextBox"
				       class="middle" required="true"
				       promptMessage="请输入用户名称" invalidMessage="" id="userName"
				       value="${targetUser.userName!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				所属机构<@splitor/>
			</div>
			<div class="content">
				<div dojoType="dijit.form.FilteringSelect" store="organizeStore" labelAttr="text"
				     name="targetUser.organizationId" value="${(targetUser.organizationId)!}" searchAttr="text"
				     autoComplete="true"
				      required="false">
				</div>
				<script type="text/javascript">
					var organizeStore = new dojo.data.ItemFileReadStore({
						data:{
							identifier:"value",
							label:"text",
							items:[
								<#list availableOrganize![] as option>
									<#if (option_index > 0 )>
										,
									</#if>
									{value:"${option.value!}",text:"${option.text!}"}
								</#list>
							]
						}
					})
				</script>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				到期日期<@splitor/>
			</div>
			<div class="content">
				<input id="expireDate" dojoType="dijit.form.DateTextBox"
				       value="${getDate(targetUser.expireDate)}" class="small" required="true"
				       name="targetUser.expireDate"
				       constraints="{min:'2011-01-01', max:'2020-12-31'}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				密码<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.password" dojoType="dijit.form.ValidationTextBox"
				        type="password" regExp="^\w{5,20}$"
				       required="true" promptMessage="请输入密码"
				       invalidMessage="请输入5-20位数字或字母!" id="password" value="${targetUser.password!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				重复密码<@splitor/>
			</div>
			<div class="content">
				<input name="password2" dojoType="dijit.form.ValidationTextBox"
				        type="password" regExp="^\w{5,20}$"
				       required="true" promptMessage="请输入密码"
				       invalidMessage="请输入5-20位数字或字母!" id="password2" value="${targetUser.password!}"/>
			</div>
		</div>

		<div class="cell">
			<div class="label">
				电话<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.telephone" dojoType="dijit.form.ValidationTextBox"
				       regExp="^\d+$" id="telephone"
				       value="${targetUser.telephone!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				手机<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.phone" dojoType="dijit.form.ValidationTextBox"
				        regExp="^\d+$" id="phone"
				       value="${targetUser.phone!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				E-mail<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.email" dojoType="dijit.form.ValidationTextBox"
				       class="middle" id="email"
				       value="${targetUser.email!}"/>
			</div>
		</div>
		<div class="cell">
			<div class="label">
				<label for="active">
					是否启用<@splitor/>
				</label>
			</div>
			<div class="content">
			<@checkbox name="targetUser.active" id="active" value=targetUser.active />
			</div>
		</div>
		<div class="cell-single-line">
			<div class="label">
				地址1<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.address1" dojoType="dijit.form.ValidationTextBox"
				       class="huge" id="address1"
				       value="${targetUser.address1!}"/>
			</div>
		</div>
		<div class="cell-single-line">
			<div class="label">
				地址2<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.address2" dojoType="dijit.form.ValidationTextBox"
				       class="huge" id="address2"
				       value="${targetUser.address2!}"/>
			</div>
		</div>
		<div class="cell-single-line">
			<div class="label">
				地址3<@splitor/>
			</div>
			<div class="content">
				<input name="targetUser.address3" dojoType="dijit.form.ValidationTextBox"
				       class="huge" id="address3"
				       value="${targetUser.address3!}"/>
			</div>
		</div>
		<div class="clear"></div>
	</div>
	<div dojoType="dijit.layout.TabContainer" style="width:100%;height:350px">
		<div dojoType="dijit.layout.ContentPane" title="所属角色">
			<div style="float: left;padding-left: 240px; text-align: center;margin-right:10px;">
				<span style="font-weight: bold;">未分配角色</span> <br>

				<div dojoType="dijit.form.Button" onClick="c1.selectAll();">
					全选
				</div>
				<div dojoType="dojo.dnd.Source" jsId="c1" class="container">
					<#list unDistributeRoles![] as ops>
						<div value="${ops.value!}" class="dojoDndItem">
						${ops.text!}
						</div>
					</#list>
				</div>
			</div>
			<div style="float: left; text-align: center;margin-left:10px;">
				<span style="font-weight: bold;">已分配角色</span> <br>

				<div dojoType="dijit.form.Button" onClick="c2.selectAll();">
					全选
				</div>
				<div dojoType="dojo.dnd.Source" id="c2" jsId="c2" class="container">
					<#list distributeRoles![] as ops>
						<div value="${ops.value!}" class="dojoDndItem">
						${ops.text!}
						</div>
					</#list>
				</div>
			</div>
		</div>
		<div dojoType="dijit.layout.ContentPane" title="仓库权限">
		</div>
		<div dojoType="dijit.layout.ContentPane" title="客户权限">
		</div>
		<div dojoType="dijit.layout.ContentPane" title="供应商权限">
		</div>
	</div>
<@listButton/>
</form>
</@html>
<script type="text/javascript">
	dojo.ready(function() {
		//保存按钮压下事件
		dojo.connect(dijit.byId("btnSave"), "onClick", function() {
			//校验表单
			if (detailForm.validate()) {
				var selectedRoles = [];
				dojo.query('.dojoDndItem', dojo.byId("c2")).forEach(function(item) {
					selectedRoles.push(dojo.attr(item, 'value'));
				})
				var param = dojo.mixin({"userRoles":selectedRoles.join(',')}, dojo.formToObject(dojo.byId('detailForm')))
				dojo.xhrPost({
					url : "${path}/system/user.save.do",
					content : param,
					handleAs : "json",
					load : function(json) {
						handleJsonMessage({
							message:json,
							callback:function() {
								parent.publish("user/save");
								parent.closeDialog();
							}
						});
					}
				});
			}
		});
	});
</script>